<template>
  <div id="app">
    <router-view />
  </div>
</template>

<style lang="less">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

nav {
  padding: 30px;

  a {
    font-weight: bold;
    color: #2c3e50;

    &.router-link-exact-active {
      color: #42b983;
    }
  }
}
</style>
<script type="text/javascript">
function adapter() {
  //获取布局视口宽度，因为开启了理想视口，布局视口=设备横向独立像素值
  const dpWidth = document.documentElement.clientWidth
  //计算根字体大小
  const rootFonstSize = (dpWidth * 100) / 1125
  //设置根字体大小
  document.documentElement.style.fontSize = rootFonstSize + 'px'
}
adapter()
window.onresize = adapter
</script>
